﻿define(function (require, exports, module) {
    var Canvas = require('util/canvas');
    var ImageStorage = require('util/imageStorage');
    var Config = require('util/config');
    var iRoleManager = require('newRole/iRoleManager');
    var CharacterManager = require('newRole/characterManager');
    var Birthplace = require('newRole/birthplace');
    var Character = require('character');

    var m_data;
    var m_backCallback;
    var m_propertySettings = {
        'land': { left: 208, right: 512, y: 177 },
        'water': { left: 208, right: 512, y: 199 },
        'fire': { left: 208, right: 512, y: 221 },
        'wind': { left: 208, right: 512, y: 243 }
    };
    var m_textIds = ['name', 'level', 'blood', 'atk', 'def', 'speed', 'charm', 'dp', 'loginCount'];

    exports.setData = function (data) {
        m_data = data;
    };

    exports.loadAsync = eval(Wind.compile('async', function () {
        CharacterManager.setBackCallback(function () {
            exports.loadAsync().start();
        });
        Birthplace.setFailureCallback(function () {
            exports.loadAsync().start();
        });

        $await(iRoleManager.renderAsync());
        if (0 == m_data.length) {
            setNew('newLeft');
            setNew('newRight');
        }
        else if (1 == m_data.length) {
            $await(m_setCatalogAsync(m_data[0]));
            setNew(m_data[0].isLeft ? 'newRight' : 'newLeft');
        }
        else {
            $await(m_setCatalogAsync(m_data[0]));
            $await(m_setCatalogAsync(m_data[1]));
        }
        Canvas.draw();

        Canvas.get('#backToLogin').on('click', m_backCallback);
    }));

    function setNew(id) {
        var newRole = Canvas.get('#' + id)[0];
        newRole.show();
        newRole.on('click', function () {
            CharacterManager.load(-1 < id.indexOf('Left'));
        });
    };

    var m_setCatalogAsync = eval(Wind.compile('async', function (data) {
        var side, propertyIndex;
        if (data.isLeft) {
            side = 'Left';
            propertyIndex = 0;
        } else {
            side = 'Right';
            propertyIndex = 10;
        }
        var character = new Character(data);
        var img = $await(ImageStorage.getAsync(character.getHeadBgPath()));
        Canvas.get('#head' + side)[0].setImage(img);
        img = $await(ImageStorage.getAsync(character.getExpressionUpPath()));
        Canvas.get('#expressionUp' + side)[0].setImage(img);
        img = $await(ImageStorage.getAsync(character.getExpressionDownPath()));
        Canvas.get('#expressionDown' + side)[0].setImage(img);

        for (var i = 0, id; id = m_textIds[i]; i++) {
            Canvas.get(['#', id, side].join(''))[0].setAttrs({ text: data[id], visible: true });
        }

        for (var k in m_propertySettings) {
            if (0 < data[k]) {
                var settings = m_propertySettings[k];
                img = $await(ImageStorage.getAsync(Config.images[k.toUpperCase() + '_PROPERTY']));
                for (var j = 0; j < data[k]; j++, propertyIndex++) {
                    Canvas.get('#' + propertyIndex)[0].setAttrs({
                        image: img, x: settings[side.toLowerCase()] + j * 8, y: settings.y
                    });
                }
            }
        }

        var btnEnter = Canvas.get('#enter' + side)[0];
        btnEnter.show();
        btnEnter.on('click', function () {
            require('main').loadAsync(data.isLeft).start();
        });

        var btnDelete = Canvas.get('#delete' + side)[0];
        btnDelete.show();
        btnDelete.on('click', function () {

        });
    }));

    exports.setBackCallback = function (callback) {
        m_backCallback = callback;
    };
});